<table class="table table-bordered">
    <tbody>
    <tr>
        <td>申请人</td>
        <td>管理管理员</td>
        <td>请假类型</td>
        <td>
            <select class="form-control" name="leaveType" data-edit="">
                <option>请选择</option>
                <option value="1" >年假</option>
                <option value="2" >事假</option>
                <option value="3" >调休</option>
            </select>
        </td>
    </tr>
    <tr>
        <td>开始时间</td>
        <td><input type="text" class="form-control"  oninvalid="setCustomValidity('开始时间不允许为空')" required id="startTime" name="startTime" /></td>

        <td>结束时间</td>
        <td><input type="text" class="form-control" id="endTime" name="endTime" /></td>
    </tr>
    <tr>
        <td>请假原因</td>
        <td colspan="4"><textarea class="form-control" name="reason"></textarea></td>
    </tr>
    <tr>
        <td>证明文件</td>
        <td colspan="4">
            <input type="file" class="form-control" name="picker">
            <!--<div id="uploader" class="wu-example">
                &lt;!&ndash;用来存放文件信息&ndash;&gt;
                <div id="thelist" class="uploader-list">
                    <input type="hidden" name="filePath" value="">
                    <input type="hidden" name="fileName" value="">
                </div>
                <div class="btns">
                    <div id="picker">选择文件</div>
                </div>
            </div>-->
        </td>
    </tr>
    </tbody>
</table>

<script>
    layui.use('laydate', function(){
        var laydate = layui.laydate;

        laydate.render({
            elem: '#startTime'
        });
        laydate.render({
            elem: '#endTime'
        });
    });

    /**
     * 重写表单提交前事件
     * @returns {boolean}
     */
    function preSubmit() {
        console.log('重写表单提交前事件...');
        // 此处编写任务提交前的业务逻辑（如果需要，不需要就不用重写此方法了）
        // alert('不允许提交');
        // return false;   // 返回false可阻止继续表单提交
    }

    var uploader;
    $(function () {

        var $list = $('#thelist');

        uploader = yuheUtils.createWebUploader('picker', {fType: 'F_ATT'});

        uploader.on( 'uploadSuccess', function(file, response) {
            console.log(file);
            console.log('response=', response);
            if (response.Status === 0) {
                var upload = response.upload;
                $list.append( '<div id="' + file.id + '" class="item" data-field-id="">' +
                    '<a href="javascript:void();" target="_blank" style="color: #0d6aad"><h4 class="info">' + file.name + '<span onclick="delAttachment(' + "'" + file.id + "'" + ')" style="margin-left: 3px;color: #e6131377;font-size: 14px;" class="glyphicon glyphicon-remove"></span></h4></a>' +
                    '</div>' );

                console.log('upload=', upload);
                var filePath = $list.find('input[name="filePath"]').val();
                var fileName = $list.find('input[name="fileName"]').val();
                if (filePath) {
                    filePath += ',';
                    fileName += ',';
                }
                $list.find('input[name="filePath"]').val(filePath + upload.filePath);
                $list.find('input[name="fileName"]').val(filePath + fileName + file.name);

            } else {
                alert('上传失败，请重新上传');
            }
            // $('#thelist').append('<div id="'+file.id+'" class="item"><h4 class="info">'+file.name+'</h4></div>');
            // alert('已上传' + file.id);
        });

        uploader.on( 'uploadError', function(file) {
            alert('上传出错');
            // $( '#'+file.id ).find('span.state').text('(上传出错)');
        });

        uploader.on( 'uploadComplete', function(file) {
            // alert('uploadComplete');
            // $('#'+file.id).find('.progress').fadeOut();
        });

        // 当有文件被添加进队列的时候
        // ' + "'" + data.bigOrderCode + "'" + '
        uploader.on( 'fileQueued', function(file) {
            /*$list.append( '<div id="' + file.id + '" class="item">' +
                '<h4 class="info">' + file.name + '<span onclick="delAttachment(' + "'" + file.id + "'" + ')" style="margin-left: 3px;color: #e6131377;font-size: 14px;" class="glyphicon glyphicon-remove"></span></h4>' +
                // '<p class="state">等待上传...</p>' +
                '</div>' );*/
        });


    });

    /**
     * 删除附件
     */
    function delAttachment(fileId) {
        alert('删除附件1:' + fileId);
        uploader.removeFile(fileId);
    }
</script>
